<apex:component >
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
	<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
	<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/smoothness/jquery-ui.min.css"/>
	<style>
		body {
			margin-left: 0px !important;
			margin-right: 0px !important;
		}
		
		table {
			border-collapse: collapse;
		}
		
		td.pbTitle {
			display: none !important;
		}
		
		.pbBody {
			margin-left: 0px !important;
			margin-right: 0px !important;
			background-color: #fff !important;
		}
		
		div.group {
			padding: 5px 5px 5px 6px;
			border-bottom: 6px solid #ffffcc;
			font-weight: bold;
			font-size: 15px;
		}
		
		table.wrapper {
			width: 100%;
		}
		
		table.wrapper td {
			vertical-align: top;
		}
		
		table.names {
			width: 200px;
		}
		
		table.names td {
			min-width: 200px;
			text-align: right;
			font-weight: bold;
			padding: 4px;
			border: 1px solid #555;
			background-color: #ccc;
			margin: 0px;
			height: 20px;
			text-align: right;
			vertical-align: middle !important;
		}
		
		table.forecasting {
			height: 100%;
			min-width: 50px;
			width: 100%;
		}
		
		table.forecasting td {
			padding: 4px;
			text-align: right;
			vertical-align: middle;
			height: 20px;
			border: 1px solid #666 ;
			
		}
		
		table.subTotals {
			height: 100%;
			width: 100%;
		}
		
		table.subTotals .head {
			font-weight: bold;
			background-color: #efefef;
			color: red;
		}
		
		table.subTotals td {
			padding: 4px;
			text-align: right;
			vertical-align: middle;
			height: 20px;
			border: 1px solid #666 ;
			color: red;
			font-weight: bold;
		}
		
		
		table.totals {
			height: 100%;
			width: 100%;
		}
		
		table.totals .head {
			font-size: 10px;
			background-color: #efefef;
		}
		
		table.totals td {
			padding: 4px;
			text-align: right;
			vertical-align: middle;
			height: 20px;
			border: 1px solid #666 ;
			
		}
		
		table.totals tr td:first-child {
			border: 0px;
			min-width: 4px;
			width: 4px !important;
		}
		
		table.totals tr td:first-child + td,  table.totals tr td:first-child + td + td, table.totals tr td:first-child + td + td + td{
			width: 33%;;
		}
		
		
		td.spacer {
			height: 5px !important;
			background-color: #fff !important;
			border-left: 1px solid #fff !important;
			border-right: 1px solid #fff !important;
			
		}
		
		td.separator {
			height: 15px !important;
			background-color: #fff !important;
			border-left: 1px solid #fff !important;
			border-right: 1px solid #fff !important;
			border-bottom: 1px solid #fff !important;
		}
		
		td.head {
			height: 40px !important;
			vertical-align: middle !important;
			font-weight: bold;
			text-align: center !important;
		}
		
		td.current {
			background-color: #86F7B7;
		}
		
		td.next {
			background-color: #86F7B7;
		}
		
		td.section {
			background-color: #ffffcc !important;
			font-size: 16px;
		}
		
		td.summary {
			font-size: 14px;
			text-align: center !important;
			font-weight: bold;
			background-color: #fff !important;
			font-style: italic;
		}
		
		td.editable {
			background-color: #ffffcc;
		}
		
		.no-padding {
			padding: 0px !important;
		}
		
		.no-border-top {border-top: 1px solid #fff !important;} 
		.no-border-right {border-right: 1px solid #fff !important;}
		.no-border-bottom {border-bottom: 1px solid #fff !important;}
		.no-border-left {border-left: 1px solid #fff !important;}
		.no-border {border: 1px solid #fff !important;}
		
		.no-shade {background-color: #fff !important;}
		
		.anInput {
			min-width: 30px;
			width: 100%;
			text-align: right;
			border: 1px solid #fff;
			font-size: 11px;
		}
		
		.anInput.active {
			border: 1px solid #ccc;
			background-color: #DCFBDC;
		}

		.commentCell {
			background-color: #DCFBDC;
		}
		
		.commentCell.placeholder {
			background-color: #fff;
		}

		.commentInput {
			min-width: 30px;
			width: 100%;
			text-align: left;
			border: 1px solid #DCFBDC;
			font-size: 11px;
			padding-top: 2px;
			padding-bottom: 2px;
			background-color: #DCFBDC;
		}

		
		ul#tabs {
			border-bottom: 5px solid #659765;
			
			display: block;
			margin: 0px 0px 12px 0px;
			padding: 5px 0px 0px 0px;
		}
		
		ul#tabs li {
			display: inline-block;
			margin: 0px;
		}
		
		ul#tabs li a {
			min-width: 100px;
			text-align: center;
			padding: 10px 30px 10px 30px;
			background-color: #1797C0;
			border-top-left-radius: 6px;
			border-top-right-radius: 6px;
			cursor: hand;
			cursor: pointer;
			font-weight: bold;
			color: #ffffff;
			text-decoration: none;
			display: inline-block;
			font-size: 15px;
		}
		
		ul#tabs li a:hover {
			background-color: #ccc;
			color: #333;		
		}
		
		ul#tabs li a.active {
			background-color: #659765;
			color: #fff;		
		}
		
		#tabWrapper {
			display: block;
			position: relative;
		}
		
		.tabContent {
			display: inline-block;
			position: absolute;
		}
		
		#tabWrapper .tabContent + .tabContent, #tabWrapper .tabContent + .tabContent + .tabContent {
			display: none;
		} 
		
		.green {
			color: green !important;
			font-weight: bold;
		}
		
		#commentEditor {
			display: none;
		}
		
		#comment {
			min-width: 50px;
			min-height: 100px;
			width: 100%;
			height: 95%;
		}
		
		.ui-widget-overlay {
			background: none #AAAAAA !important ;
			
		}
		
	</style>
</apex:component>